<template>
	<view class="custom" style="z-index: 99999;">
		<uni-nav-bar dark :fixed="fixed" :background-color="backgroundColor" status-bar :left-icon="leftIcon" leftWidth="250px"
			rightWidth="250px" :left-text="leftText" :right-text="getTimes" :title="title" @clickLeft="clickLeft"
			@clickRight="clickRight" />
	</view>

</template>

<script>
	import {
		time
	} from '@/store/Pinia/time.js'

	export default {
		name: "Navigator",
		data() {
			return {
				timeDate: time()

			};
		},
		props: {
			dark: {
				type: Boolean,
				default: false
			},
			title: {
				type: String,
				default: ""
			},
			leftText: {
				type: String,
				default: ""
			},
			rightText: {
				type: String,
				default: ""
			},
			leftIcon: {
				type: String,
				default: ""
			},
			rightIcon: {
				type: String,
				default: ""
			},
			fixed: {
				type: [Boolean, String],
				default: false
			},
			color: {
				type: String,
				default: ""
			},
			backgroundColor: {
				type: String,
				default: "#fa973a"
			},
			statusBar: {
				type: [Boolean, String],
				default: false
			},
			shadow: {
				type: [Boolean, String],
				default: false
			},
			border: {
				type: [Boolean, String],
				default: true
			},
			height: {
				type: [Number, String],
				default: 44
			},
			leftWidth: {
				type: [Number, String],
				default: 60
			},
			rightWidth: {
				type: [Number, String],
				default: 60
			},
			stat: {
				type: [Boolean, String],
				default: ''
			},
			customLeft: {
				type: [Boolean, String],
				default: false
			}
		},
		emits: ['clickLeft', 'clickRight', 'clickTitle'],
		mounted() {
			// getTime();	

		},
		computed: {
			getTimes() {
				if (this.timeDate.data && typeof this.timeDate.data.getFullYear === 'function') {
					return `${this.timeDate.data.getMonth()+1} 月 ${this.timeDate.data?.getDate()} 日 ${this.timeDate?.data?.getHours()} : ${this.timeDate?.data?.getMinutes()<10?'0':''}${this.timeDate?.data?.getMinutes()} : ${this.timeDate?.data?.getSeconds()<10?'0':''}${this.timeDate?.data?.getSeconds()}`
				} else {
					return ''
				}
			}
		},
		methods: {
			clickLeft() {

				this.$emit("clickLeft");
				if (this.customLeft) {} else {
					//  #ifdef H5
					console.log('H5', this.$listeners)

					history.back()
					// #endif
					// #ifdef APP-PLUS
					console.log('app')
					uni.navigateBack()
					// #endif
				}

			},
			clickRight() {
				this.$emit("clickRight");
			},
			clickTitle() {
				this.$emit("clickTitle");
			},

		}
	}
</script>

<style>
	/deep/.uni-nav-bar-text {
		font-size: 26px !important;
		font-weight: 800 !important;
	}
	/deep/.uni-nav-bar-left-text{
		font-size: 20px ;
		
	}
	/deep/.uni-nav-bar-right-text{
		font-size: 20px ;
		
	}

	/deep/.uni-navbar--border {
		border-bottom-style: none;
	}

	/deep/.uni-navbar__header {
		padding: 0 56rpx;
	}
</style>